import store from "@/store";

export default {
  // 在绑定元素的 attribute 前
  // 或事件监听器应用前调用
  created(el: HTMLElement, binding: any, vnode: any) {
    console.log("el", el)
    console.log("el", el.childNodes)
    console.log("binding", binding)
    console.log("vnode", vnode)

    el.oncontextmenu = (e1: MouseEvent) => {
      const textArray = binding.value.text;
      const handlerObj = binding.value.handler;
      // 事件处理数组
      const handlerArray = [];
      // 处理好的右键菜单
      const menuList = [];
      // 将事件处理函数放入数组中
      for (const key in handlerObj) {
        handlerArray.push(handlerObj[key]);
      }
      // 追加右键菜单数据
      for (let index = 0; index < textArray.length; index++) {
        const menu = {
          text: textArray[index],
          handler: handlerArray[index],
          id: index + 1,
        };
        menuList.push(menu);
      }
      // 鼠标点的坐标
      const mouseX = e1.clientX;
      const mouseY = e1.clientY;
      // 右键菜单出现的位置
      store.commit("contextMenu/setState", {
        status: "block",
        left: mouseX + "px",
        top: mouseY + "px",
        list: menuList,
      });
      return false;
    };
  },
};
